<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		
		<style type="text/css">
			#imgId{
				height: 120px;
				width: 120px;
			}
		</style>
	</head>
	<body>
		<div id="div1" align="center">
			<select id="selectId">
				<option value ="选择">选择大小</option>
				<option value="大">大</option>
				<option value ="小">小</option>
			</select>
		</div>
		<div id="div2" align="center">
			<img id="imgId" src="摇色子/1.jpg" >
		</div>
		<div id="div3" align="center">
			<button type="button" onclick="fun1()">开始</button>
		</div>
	</body>
	<script type="text/javascript">
		var n=1;
		function fun1(event){
			var div1 = document.getElementById('imgId');
			var num = getRandValidNum();
			var time = setInterval(function(){
				document.getElementsByTagName('button')[0].innerHTML='抽奖中。。。'
				document.getElementsByTagName('button')[0].disable="disabled"
				
				var imgs = document.getElementById('imgId')
					imgs.src = "摇色子/"+n+".jpg"
					imgs.value=n;
					n++;
				if(n>=7){
					n=1;
				}
			},num);
			
			setTimeout(function(){
				clearInterval(time);
				document.getElementsByTagName('button')[0].disable="";
				document.getElementsByTagName('button')[0].innerText="重新抽奖"
				var jg= document.getElementById('imgId');
				
				var nn='';
				if(div2.value<=3){
					nn='1';
				}else if(div2.value>3){
					nn='2';
				}
				var selectId=document.getElementById("selectId")
				var num1 = selectId.selectedIndex;
				if(nn == num1){
					alert("猜对了");
				}
				else{
					alert("猜错了");
				}
			},2000)
		}
		function getRandValidNum(){
			while(true){
				var randNum = Math.floor((Math.random()*100)+50);
		        if(randNum!=0){
		            return randNum;
		        }
			}				
		}
	</script>
</html>
